<template>
	<m-layout :title="typeName" >
		<view class="news-list" :class="code">
			<m-new-item class="new-item" v-for="(item, idx) in listArr" :key="idx" :item="item"></m-new-item>
		</view>
		<m-loading :list='listArr' :pageIndex="pageIndex" :pageCount="pageCount" :loading="isLoading" />
	</m-layout>
</template>

<script>
	import { GetNewsPage } from '@/api/News.js'
	export default {
		data() {
			return {
				code: '',
				listArr: [],
				pageIndex: 1,
				pageCount: 1,
				isLoading: true,
			};
		},
		watch: {
			tabIdx() {
				this.reset()
			},
		},
		computed: {
			typeName() {
				return {
					'news1': '',
					'news2': '',
					'news3': '',
					'news4': '',
					'notice': '',
				} [this.code]
			}
		},
		onLoad({ code }) {
			this.code = code;
			this.reset()
		},
		methods: {
			reset() {
				this.pageCount = 1;
				this.pageIndex = 1;
				this.getData();
			},
			async getData() {
				if (this.pageIndex > this.pageCount) {
					return
				}
				this.isLoading = true;
				const { list, pageCount } = await GetNewsPage({
					code: this.code,
					PageIndex: this.pageIndex,
				});
				this.isLoading = false;
				this.pageCount = pageCount;
				if (this.pageIndex <= 1) {
					this.listArr = list;
				} else {
					this.listArr = [...this.listArr, ...list];
				}
				this.pageIndex++;
				uni.stopPullDownRefresh();
			},
		},
		onPullDownRefresh() {
			this.reset();
		},
		onReachBottom() {
			this.getData();
			console.log("触底了");
		},
	}
</script>

<style lang="scss">
	.news-list{
		.new-item:last-child {
			/deep/ .type1 {
				border: 0;
			}
		}
	}
	.notice{
		.new-item {
		}
	}
	
</style>